// 物资盘点单生成与录入
import React from 'react';
import { Card, Row, Col, Form, DatePicker, Select, Button, Popconfirm, Table, message, Pagination, Input, Icon } from 'antd';
import { $http } from 'containers/config/https';
import ColumnAuthoritysModel from 'pages/columnAuthority/ColumnAuthoritysModel';
import Moment from 'moment';
import store from 'store';
import AddPayment from './component/AddPayment';
import CommonPagination from 'components/pagination/index';
import './style/index.less';
var standingNumber = 0; //盘点单序列号

const { Option } = Select;
const FormItem = Form.Item;
const formItemLayout = {    // label 和input宽度
    labelCol: { span: 7 },
    wrapperCol: { span: 17 },
};
var bilData = [];
const TakeStockCreateBill = Form.create()(
    class extends React.Component {
        constructor() {
            super();
            this.state = {
                userInfo: JSON.parse(window.sessionStorage.userData),
                data: [],
                queryCondition: {},
                SelectData: {},
                inOpLocDr: '',
                vendor: '',
                detailsId: '',//盘点单ID
                detailsListData: [], //盘点单明细数据
                WaListData: [], //盘点单数据
                pageSize: 10,
                page: 1,
                pageSize2: 50,
                page2: 1,
                total: 0,
                detailTotal: 0,
                show: false,
                method: '',
                stkTakeGroupID: undefined,
                columns: [], //表头数据
                detailWidthTotal: '',
                modalColumns: [],//表头数据
                modalColumnTotal: '',
                ChineseEnglishSize: {}, // 中英翻译
                takeStockListCode: '', // 表头弹窗识别code
                transformData: false,
                state: '',
                stkInputDesc: undefined,
                defaultAssignment: false, //  是否默认带出盘点数量
            };

            // 药品的数据表头
            this.columns = [
                {
                    key: 1,
                    title: '盘点单号',
                    dataIndex: 'stkTakeNO',
                    align: "center",
                    width: '25%'
                },
                {
                    key: 2,
                    title: '状态',
                    dataIndex: 'stateDesc',
                    align: "center",
                    width: '16%'
                },
                {
                    key: 3,
                    title: '调整库存',
                    dataIndex: 'stockDesc',
                    align: "center",
                    width: '13%'
                },
                {
                    key: 4,
                    title: '冻结时间',
                    dataIndex: 'freezeTime',
                    align: "center",
                    width: '23%'
                },
                {
                    key: 5,
                    title: '盘点时间',
                    dataIndex: 'takeTime',
                    align: "center",
                    width: '23%'
                }

            ];

            // 盘点单详细表头
            this.modalColumns = [
                {
                    key: 9,
                    title: '药品代码',
                    dataIndex: 'stockCode',
                    align: "center",
                    width: '10%',
                    sorter: (a, b) => a.stockCode - b.stockCode,
                },
                {
                    key: 1,
                    title: '药品名称',
                    dataIndex: 'stockDesc',
                    align: "center",
                    width: '13%'
                },
                {
                    key: 2,
                    title: '货位号',
                    dataIndex: 'stockBin',
                    align: "center",
                    width: '10%',
                    sorter: (a, b) => a.stockBin - b.stockBin,
                },
                {
                    key: 5,
                    title: '包装规格',
                    dataIndex: 'stockSpec',
                    align: "center",
                    width: '10%',
                },
                {
                    key: 6,
                    title: '冰结数量(库存单位)',
                    dataIndex: 'purQtyDesc',
                    align: "center",
                    width: '10%',
                },
                {
                    key: 7,
                    title: '冰结数量(基本单位)',
                    dataIndex: 'baseQtyDesc',
                    align: "center",
                    width: '10%',
                },
                {
                    key: 3,
                    title: '盘点数量(库存单位)',
                    dataIndex: 'takeStockNumIn',
                    align: "center",
                    width: '12%',
                    editable: true,
                    render: (text, record, index) => {
                        return (<span><Input min={0} type="number" value={record.purQty} onChange={(e) => this.handleFieldChange(e, 'purQty', record.ID)} style={{ float: 'left', marginLeft: '6px', width: '50%', padding: '0', paddingLeft: '5px' }} /><span style={{ verticalAlign: '-webkit-baseline-middle' }}>{record.purUnitDesc}</span></span>)
                    }
                },
                {
                    key: 10,
                    title: '盘点数量(基本单位)',
                    dataIndex: 'takeStockNumBa',
                    align: "center",
                    width: '12%',
                    render: (text, record) => {
                        return (<span><Input min={0} type="number" value={record.baseQty} style={{ float: 'left', marginLeft: '6px', width: '50%', padding: '0', paddingLeft: '5px' }} onChange={(g) => { this.handleFieldChange(g, 'baseQty', record.ID) }} /><span style={{ verticalAlign: '-webkit-baseline-middle' }}>{record.baseUnitDesc}</span></span>)
                    },
                },
                {
                    key: 8,
                    title: '生产厂家',
                    dataIndex: 'manfDesc',
                    align: "center",
                    width: '13%',
                }
            ]
        }

        componentDidMount() {
            // 初始化数据
            this.getInitialData();
            this.getDetailTableColumns();
            this.getTableColumns();
            let leftList = document.querySelectorAll('.waListHeight  .ant-table-body');
            if (leftList.length > 0) {
                leftList[0].style.height = store.getState().tableHeight.y + 40 + 'px';
            }
            let listData = document.querySelectorAll('.detailsHeight  .ant-table-body');
            if (listData.length > 0) {
                listData[0].style.height = store.getState().tableHeight.y + 'px';
            }
        }

        getTableColumns = () => {
            let { userInfo } = this.state;
            let data = {
                params: [{
                    reactCode: ['MaterialInventoryGenerationAnd'],
                    compontName: 'MaterialInventoryGenerationAnd',
                    type: 'C',
                }]
            }
            $http.post('urlS', this, {
                code: '01040073',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let arr = res.result.C && res.result.C.length > 0 ? JSON.parse(JSON.stringify(res.result.C)).map((item, index) => {
                            return {
                                ...item,
                                key: index + 1,
                                title: <div onDoubleClick={() => {
                                    this.setState({ takeStockListCode: 'MaterialInventoryGenerationAnd' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}>{userInfo.language == 'EN' ? item.enDescripts : item.title}</div>
                            }
                        }) : '';
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        this.setState({ columns: filterArr, detailWidthTotal: res.totalWidth, ChineseEnglishSize: userInfo.language == 'EN' ? res.result.language.EN : res.result.language.CN });

                    }
                }
            });
        }

        //组件权限编辑器
        onColumnRef = (ref) => {
            this.columnRef = ref;
        }

        // 获取明系列表头数据
        getDetailTableColumns = () => {
            let { userInfo } = this.state;
            let data = {
                params: [{
                    compontName: 'MaterialInventoryEnterDetails',
                    type: 'C',
                }]
            }
            $http.post('urlS', this, {
                code: '01040073',
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let arr = res.result.C && res.result.C.length > 0 ? JSON.parse(JSON.stringify(res.result.C)).map((item, index) => {
                            return {
                                ...item,
                                key: index + 1,
                                title: <div onDoubleClick={() => {
                                    this.setState({ takeStockListCode: 'MaterialInventoryEnterDetails' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}>{userInfo.language == 'EN' ? item.enDescripts : item.title}</div>,
                                render: (text, record) => {
                                    if (item.code == 'takeStockNumIn') {
                                        return (<span><Input min={0} type="number" value={record.purQty} onChange={(e) => this.handleFieldChange(e, 'purQty', record.ID)} style={{ float: 'left', marginLeft: '6px', width: '50%', padding: '0', paddingLeft: '5px' }} /><span style={{ verticalAlign: '-webkit-baseline-middle' }}>{record.purUnitDesc}</span></span>)
                                    } else if (item.code == 'takeStockNumBa') {
                                        return (<span><Input min={0} type="number" value={record.baseQty} style={{ float: 'left', marginLeft: '6px', width: '50%', padding: '0', paddingLeft: '5px' }} onChange={(g) => { this.handleFieldChange(g, 'baseQty', record.ID) }} /><span style={{ verticalAlign: '-webkit-baseline-middle' }}>{record.baseUnitDesc}</span></span>)
                                    } else {
                                        return (<span>{text}</span>)
                                    }
                                }
                            }
                        }) : '';
                        let filterArr = arr.filter(function (item) { return item.display === 'Y' });
                        this.setState({ modalColumns: filterArr, modalColumnTotal: res.totalWidth });

                    }
                }
            });
        }

        //获取操作行数据对象
        getRowByKey(key, newData) {
            const { detailsListData } = this.state;
            return (newData || detailsListData).filter(item => item.ID === key)[0];
        }

        //文本框数据修改
        handleFieldChange = (e, fieldName, key) => {
            const { detailsListData } = this.state;
            const newData = detailsListData.map(item => ({ ...item }));
            const target = this.getRowByKey(key, newData);
            if (target) {
                target[fieldName] = e.target.value;
                this.setState({ detailsListData: newData });
            }
        }

        //清空表格内容
        handleReset = () => {
            this.setState({ WaListData: [], detailsListData: [], total: 0, detailsId: '' });
            this.props.form.setFieldsValue({ stockDr: undefined });
            this.props.form.resetFields();
        }

        // 获取界面默认值
        getInitialData() {
            let data = {
                params: []
            };
            // 获取下拉数据
            $http.post('urlS', this, {
                code: "02060088",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        this.setState({ SelectData: res }, () => {
                            this.searchInformation();
                        })
                    }
                }
            })
        }

        searchInformation = () => {
            this.setState({ page: 1 }, () => {
                this.getWarehouseList()
            })
        }

        // 获取盘点单据列表数据
        getWarehouseList = () => {
            let { ChineseEnglishSize } = this.state;
            this.setState({ loading: true })
            let qLocDr = this.props.form.getFieldValue('loc');
            let state = this.props.form.getFieldValue('state');
            let EndData = this.props.form.getFieldValue('EndData');
            let StartDate = this.props.form.getFieldValue('StartDate');
            let data = {
                params: [{
                    begin: StartDate ? Moment(StartDate).format('YYYY-MM-DD') : undefined,
                    end: EndData ? Moment(EndData).format('YYYY-MM-DD') : undefined,
                    locID: qLocDr ? qLocDr : undefined,
                    stateID: state ? state : undefined
                }],
                pagination: [
                    {
                        pageSize: this.state.pageSize,
                        currentPage: this.state.page,
                        sort: "ID",
                        dir: "asc",
                    }
                ],
            };
            $http.post('urlS', this, {
                code: "02060091",
                data: data,
                success: function (res) {
                    if (res.rows.length > 0) {
                        for (var i = 0; i < res.rows.length; i++) {
                            res.rows[i].key = i;
                            res.rows[i].freezeTime = res.rows[i].createDate + '  ' + res.rows[i].createTime;
                            res.rows[i].takeTime = res.rows[i].sumDate + '  ' + res.rows[i].sumTime;
                        }
                        this.setState({ WaListData: res.rows, total: res.total, detailsId: res.rows[0].stkTakeID, method: res.rows[0].method, page2: 1, loading: false, state: res.rows[0].stateID, transformData: true });
                        // standingNumber = 0;
                        this.getTakeStockDetails(res.rows[0].stkTakeID)
                    } else {
                        this.setState({ WaListData: [], detailsListData: [], state: '' });
                        message.error(ChineseEnglishSize.MaterialInventoryGenerationAndnoData ? ChineseEnglishSize.MaterialInventoryGenerationAndnoData.descripts : "没数据")
                    }
                },
                error: function (err) {
                    message.error(err.errorMessage)
                }
            });
        }

        // 获取详情列表
        getTakeStockDetails = (type) => {
            this.setState({ detailsLoading: true })
            let serialNo = ""
            if (type === "enter") {
                serialNo = this.state.stkInputDesc || ''
                console.log("this.state.stkInputDesc", this.state.stkInputDesc)
            }
            let data = {
                params: [{
                    stkTakeID: this.state.detailsId ? this.state.detailsId : "",
                    stkTakeGroupID: this.state.stkTakeGroupID ? this.state.stkTakeGroupID : "",
                    stkInputDesc: this.state.stkInputDesc ? this.state.stkInputDesc : "",
                    serialNo: serialNo || ''
                }],
                pagination: [
                    {
                        pageSize: this.state.pageSize2,
                        currentPage: this.state.page2,
                        sort: "ID",
                        dir: "asc",
                    }
                ]
            };
            $http.post('urlS', this, {
                code: "02060092",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        let defaultAssignment = this.state.stkInputDesc ? true : false;
                        console.log(defaultAssignment)
                        for (let i = 0; i < res.rows.length; i++) {
                            res.rows[i].key = i;
                            res.rows[i].takeStockNumBa = type === "enter" ? 1 : res.rows[i].takeStockNumBa;
                            res.rows[i].purQtyDesc = res.rows[i].accPurQty + '  ' + res.rows[i].purUnitDesc;
                            res.rows[i].baseQtyDesc = res.rows[i].accBaseQty + '  ' + res.rows[i].baseUnitDesc;
                            res.rows[i].purQty = (res.rows[i].purQty === "" || res.rows[i].purQty === undefined) ? (defaultAssignment ? 1 : "") : res.rows[i].purQty; // 盘点数量(库存单位)
                            res.rows[i].baseQty = (res.rows[i].baseQty === "" || res.rows[i].baseQty === undefined) ? (defaultAssignment ? 1 : "") : res.rows[i].baseQty; // 盘点数量(基本单位)
                        }
                        bilData = JSON.parse(JSON.stringify(res.rows));   // 深拷贝
                        this.setState({ detailsListData: res.rows, detailTotal: res.total, detailsLoading: false }, () => {

                            if (type === "enter") {
                                this.saveHostData()   // 晶体序列号查询的数据回车查询后直接保存
                            } else {
                                this.setState({
                                    stkInputDesc: undefined
                                })
                            }
                        });
                    } else {
                        this.setState({ detailsListData: [], detailTotal: 0, detailsLoading: false, stkInputDesc: undefined })
                    }
                }
            })
        }

        // 获取到盘点部门的值
        getInOpLocDr() {
            let inOpLocDr = this.props.form.getFieldValue('locDr');
            this.setState({ inOpLocDr: inOpLocDr });
            return inOpLocDr
        }

        //点击行，渲染当前行样式
        setRowClassName = (record) => {
            standingNumber = standingNumber + 1;
            if (record) {
                if (this.state.detailsId == record.stkTakeID) return 'clickRowStyle';
                else return '';
            } else {
                return '';
            }
        }

        // 页码改变的回调，参数是改变后的页码及每页条数
        onChange = (page, pageSize) => {
            this.setState({ page: page, pageSize: this.state.pageSize }, () => {
                // 重新调用查询方法
                this.getWarehouseList();
            });
        }

        // 显示分页总条数
        showTotal(total) {
            return `共 ${total} 条`;
        }

        onShowSizeChange = (current, size) => {
            this.setState({ page: current, pageSize: size }, () => {
                // 重新调用查询方法
                this.onChange(current, size);
            })
        }

        // 页码改变的回调，参数是改变后的页码及每页条数 盘点单详情
        onChange2 = (page, pageSize) => {
            this.setState({ page2: page, pageSize2: this.state.pageSize2 }, () => {
                // 重新调用查询方法
                this.getTakeStockDetails(this.state.detailsId);
            });
        }

        onShowSizeChange2 = (current, size) => {
            this.setState({ page2: current, pageSize2: size }, () => {
                // 重新调用查询方法
                this.onChange2(current, size);
            })
        }

        // 收起明细录入
        packUpHandle = () => {
            this.setState({ show: !this.state.show, span: 24 })
        }

        onRef = (ref) => {
            this.childModal = ref;
        }

        addPaymentReceipt = () => {
            this.childModal.showModal();
        }

        getStkTakeGroup = (e) => {
            let { ChineseEnglishSize } = this.state;
            if (this.state.detailsId) {
                this.setState({ stkTakeGroupID: e, page2: 1 }, () => {
                    this.getTakeStockDetails()
                })
            } else {
                this.setState({ stkTakeGroup: undefined });
                message.error(ChineseEnglishSize.MaterialInventoryGenerationAndpleaseSelectData ? ChineseEnglishSize.MaterialInventoryGenerationAndpleaseSelectData.descripts : '请选择一条盘点单据')
            }
        }

        getStkInputDesc = (e) => {
            let { ChineseEnglishSize } = this.state;
            if (this.state.detailsId) {
                this.setState({ stkInputDesc: e.target.value, page2: 1 }, () => {
                    this.getTakeStockDetails(this.state.stkInputDesc ? "enter" : "")
                })
            } else {
                this.setState({ stkInputDesc: undefined });
                message.error(ChineseEnglishSize.MaterialInventoryGenerationAndpleaseSelectData ? ChineseEnglishSize.MaterialInventoryGenerationAndpleaseSelectData.descripts : '请选择一条盘点单据')
            }
        }

        getInputDesc = (e) => {
            this.setState({ stkInputDesc: e.target.value }, () => {
                console.log("stkInputDesc", this.state.stkInputDesc)
            })
        }

        //主页面保存
        saveHostData = () => {
            let { ChineseEnglishSize } = this.state;
            if (this.state.detailsListData == bilData) {
                message.error(ChineseEnglishSize.MaterialInventoryGenerationAndnoSaveData ? ChineseEnglishSize.MaterialInventoryGenerationAndnoSaveData.descripts : '没有保存的数据');
                return
            }
            let data = {
                params: [{
                    stkTakeID: this.state.detailsId ? this.state.detailsId : undefined,
                    detail: this.state.detailsListData ? this.state.detailsListData : undefined

                }]
            };
            $http.post('urlS', this, {
                code: "02060093",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        message.success(res.errorMessage);
                        this.setState({ detailsListData: [] }, () => {
                            this.getTakeStockDetails();
                        });

                    }
                }
            })
        }

        transformData = (num) => {
            let { stkTakeGroupID } = this.state;
            let data = {
                params: [{
                    // detail: this.state.detailsListData ? this.state.detailsListData : undefined,
                    stkTakeID: this.state.detailsId ? this.state.detailsId : undefined,
                    takeGroupID: stkTakeGroupID,
                    defaultType: num ? num : undefined

                }]
            };
            //保存数据
            $http.post('urlS', this, {
                code: "02060184",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        message.success(res.errorMessage);
                        this.setState({ detailsListData: [], transformData: false }, () => {
                            this.getTakeStockDetails();
                        });

                    }
                }
            })
        }

        /**
        * @ByShizi: 删除
        * 需求 960
        * Create 2022-09-27
        * */
        handleDelete = () => {
            let data = {
                params: [{
                    stkTakeID: this.state.detailsId ? this.state.detailsId : undefined,
                }]
            };
            $http.post('urlS', this, {
                code: "02060097",
                data: data,
                success: function (res) {
                    if (+res.errorCode === 0) {
                        message.success(res.errorMessage);
                        this.getWarehouseList();
                    }
                }
            })
        };

        render() {
            const { getFieldDecorator } = this.props.form;
            //盘点下拉列表
            let loc = [];
            let state = [];
            let takeGroup = [];
            this.state.SelectData.loc && this.state.SelectData.loc.map((item, i) => {
                loc.push(<Option value={item.id} key={i}>{item.descripts}</Option>)
            });
            this.state.SelectData.state && this.state.SelectData.state.map((item, i) => {
                state.push(<Option value={item.id} key={i}>{item.descripts}</Option>)
            });
            this.state.SelectData.takeGroup && this.state.SelectData.takeGroup.map((item, i) => {
                takeGroup.push(<Option value={item.id} key={i}>{item.descripts}</Option>)
            });
            let { columns, detailWidthTotal, modalColumns, modalColumnTotal, ChineseEnglishSize, stkInputDesc, stkTakeGroupID } = this.state;
            return (
                <div className="takeStockCreateBill">
                    <Row>
                        <Card
                            size="small"
                            title={<div className="card-title-left-icon"><div></div>{ChineseEnglishSize.MaterialInventoryGenerationAndinventory ? ChineseEnglishSize.MaterialInventoryGenerationAndinventory.descripts : '盘点'}</div>}
                        >
                            <Col span={13}>
                                <Form>
                                    <Row >
                                        <Col span={6}>
                                            <FormItem {...formItemLayout} label={ChineseEnglishSize.MaterialInventoryGenerationAndloc ? ChineseEnglishSize.MaterialInventoryGenerationAndloc.descripts : '科室'}>
                                                {getFieldDecorator('loc', {
                                                    initialValue: this.state.userInfo.locID ? this.state.userInfo.locID : undefined,
                                                    rules: [{ required: ChineseEnglishSize.MaterialInventoryGenerationAndloc ? ChineseEnglishSize.MaterialInventoryGenerationAndloc.required == 'Y' ? true : false : false, message: ChineseEnglishSize.MaterialInventoryGenerationAndloc ? ChineseEnglishSize.MaterialInventoryGenerationAndloc.message : '科室不能为空' }]
                                                })(
                                                    <Select allowClear={true}>
                                                        {loc}
                                                    </Select>
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={6}>
                                            <FormItem {...formItemLayout} label={ChineseEnglishSize.MaterialInventoryGenerationAndstate ? ChineseEnglishSize.MaterialInventoryGenerationAndstate.descripts : '状态'}>
                                                {getFieldDecorator('state', {
                                                    initialValue: undefined,
                                                    rules: [{ required: ChineseEnglishSize.MaterialInventoryGenerationAndstate ? ChineseEnglishSize.MaterialInventoryGenerationAndstate.required == 'Y' ? true : false : false, message: ChineseEnglishSize.MaterialInventoryGenerationAndstate ? ChineseEnglishSize.MaterialInventoryGenerationAndstate.message : '状态不能为空' }]
                                                })(
                                                    <Select allowClear={true}>
                                                        {state}
                                                    </Select>
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={4} className="queryTime" style={{ marginLeft: '30px' }}>
                                            <FormItem>
                                                {getFieldDecorator('StartDate', {
                                                    initialValue: this.state.SelectData.params ? Moment(this.state.SelectData.params.startDate, 'YYYY-MM-DD') : Moment(),
                                                    rules: [{ required: ChineseEnglishSize.MaterialInventoryGenerationAndStartDate ? ChineseEnglishSize.MaterialInventoryGenerationAndStartDate.required == 'Y' ? true : false : false, message: ChineseEnglishSize.MaterialInventoryGenerationAndStartDate ? ChineseEnglishSize.MaterialInventoryGenerationAndStartDate.message : '起始日期不能为空' }]
                                                })(
                                                    <DatePicker />
                                                )}
                                            </FormItem>
                                        </Col>
                                        <Col span={1} style={{ textAlign: 'center', lineHeight: '37px' }}>
                                            <span>{ChineseEnglishSize.MaterialInventoryGenerationAndto ? ChineseEnglishSize.MaterialInventoryGenerationAndto.descripts : '到'}</span>
                                        </Col>
                                        <Col span={4} className="queryTime">
                                            <FormItem>
                                                {getFieldDecorator('EndData', {
                                                    initialValue: this.state.SelectData.params ? Moment(this.state.SelectData.params.endDate, 'YYYY-MM-DD') : Moment(),
                                                    rules: [{ required: ChineseEnglishSize.MaterialInventoryGenerationAnddeadline ? ChineseEnglishSize.MaterialInventoryGenerationAnddeadline.required == 'Y' ? true : false : false, message: ChineseEnglishSize.MaterialInventoryGenerationAnddeadline ? ChineseEnglishSize.MaterialInventoryGenerationAnddeadline.message : '截止日期不能为空' }]
                                                })(
                                                    <DatePicker />
                                                )}
                                            </FormItem>
                                        </Col>
                                    </Row>
                                </Form>
                            </Col>
                            <Col span={4} style={{ marginLeft: '-50px' }}>
                                <Row style={{ marginTop: '4px' }} className="buttonLeft">
                                    <Button onClick={this.searchInformation}>{ChineseEnglishSize.MaterialInventoryGenerationAndsearch ? ChineseEnglishSize.MaterialInventoryGenerationAndsearch.descripts : '查询'}</Button>
                                </Row>
                            </Col>
                            <Col span={7} style={{ textAlign: 'right' }}>
                                <Row style={{ marginTop: '4px' }} className="buttonRight">
                                    <Button onClick={this.saveHostData}>{ChineseEnglishSize.MaterialInventoryGenerationAndsave ? ChineseEnglishSize.MaterialInventoryGenerationAndsave.descripts : '保存'}</Button>
                                    <Button style={{ margin: '0 24px' }} onClick={this.addPaymentReceipt}>{ChineseEnglishSize.MaterialInventoryGenerationAndadd ? ChineseEnglishSize.MaterialInventoryGenerationAndadd.descripts : '新增'}</Button>
                                    {this.state.detailsId ? (
                                        <Popconfirm title="删除不可恢复，确定要删除吗？" onConfirm={this.handleDelete}>
                                            <Button ghost type="danger">删除</Button>
                                        </Popconfirm>
                                    ) : (
                                        <Button disabled>删除</Button>
                                    )}
                                </Row>
                            </Col>
                        </Card>
                    </Row>
                    <Row>
                        <Col span={6} style={{ display: this.state.show ? 'none' : '' }} className={!this.state.show ? "animate-wrap active down-in" : "animate-wrap"}>
                            <Card
                                size="small"
                                title={<div className="card-title-left-icon"><div></div>{ChineseEnglishSize.MaterialInventoryGenerationAndinventoryDoc ? ChineseEnglishSize.MaterialInventoryGenerationAndinventoryDoc.descripts : '盘点单据'}</div>}
                                extra={<span style={{ color: '#666' }} className='span' onClick={() => {
                                    this.setState({ takeStockListCode: 'MaterialInventoryGenerationAnd' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}><Icon type="setting" title={ChineseEnglishSize.MaterialInventoryGenerationAndcolumnSettings ? ChineseEnglishSize.MaterialInventoryGenerationAndcolumnSettings.descripts : '列权限设置'} /></span>}
                            >
                                <div className="drugList ">
                                    <Table
                                        columns={columns.length > 0 ? columns : this.columns}
                                        dataSource={this.state.WaListData}
                                        pagination={false}
                                        bordered
                                        scroll={{ x: detailWidthTotal ? detailWidthTotal : 600, y: store.getState().tableHeight.y + 3 }}
                                        rowClassName={this.setRowClassName}
                                        rowKey={record => record.key}
                                        className='waListHeight'
                                        onRow={(record) => {
                                            return {
                                                onClick: () => {
                                                    if (this.state.detailsId === '') {
                                                        // 保存行数据以及ID
                                                        this.setState({ detailsId: record.stkTakeID, method: record.method, page2: 1, transformData: true, state: record.stateID }, () => {
                                                            this.getTakeStockDetails();
                                                        });

                                                    } else {
                                                        if (this.state.detailsId !== record.stkTakeID) {
                                                            this.setState({ detailsId: record.stkTakeID, method: record.method, page2: 1, transformData: true, state: record.stateID }, () => {
                                                                this.getTakeStockDetails();
                                                            });
                                                        } else {
                                                            this.setState({ detailsId: '', method: '', detailsListData: [], transformData: false, state: '' })
                                                        }
                                                    }
                                                },

                                            };
                                        }}
                                    />
                                    <Pagination
                                        showTotal={() => this.showTotal(this.state.total)}
                                        size="small"
                                        showQuickJumper
                                        showSizeChanger
                                        defaultCurrent={1}
                                        total={this.state.total ? this.state.total : 0}
                                        onChange={this.onChange.bind(this)}
                                        onShowSizeChange={this.onShowSizeChange.bind(this)}
                                        style={{ textAlign: "right", margin: '8px 0' }}
                                    />
                                </div>
                            </Card>
                        </Col>
                        <Col span={this.state.show ? 24 : 18}>
                            <Card
                                size="small"
                                title={<span><Icon onClick={this.packUpHandle} type={!this.state.show ? "double-left" : "double-right"} />{ChineseEnglishSize.MaterialInventoryGenerationAndinventoryFormDetail ? ChineseEnglishSize.MaterialInventoryGenerationAndinventoryFormDetail.descripts : '盘点单明细'}</span>}
                                extra={<span style={{ color: '#666' }} className='span' onClick={() => {
                                    this.setState({ takeStockListCode: 'MaterialInventoryEnterDetails' }, () => {
                                        this.columnRef.onOpenModel();
                                    })
                                }}><Icon type="setting" title={ChineseEnglishSize.MaterialInventoryGenerationAndcolumnSettings ? ChineseEnglishSize.MaterialInventoryGenerationAndcolumnSettings.descripts : '列权限设置'} /></span>}
                            >
                                <Row className="centerSelect" style={{ display: "flex", alignItems: "center", marginBottom: "10px" }}>
                                    <span>{ChineseEnglishSize.MaterialInventoryGenerationAndentryWay ? ChineseEnglishSize.MaterialInventoryGenerationAndentryWay.descripts : '本单据录入方式:'}</span><span> : {this.state.method}</span>
                                    <div className="centerSelectCenter" style={{ margin: "0 48px" }}>
                                        <Button disabled={!this.state.transformData} style={{ color: '#666', cursor: 'pointer', width: '145px', height: '30px', lineHeight: '24px' }} onClick={() => {
                                            if (this.state.transformData && this.state.state == 10) { this.transformData(1) }
                                        }
                                        }>{ChineseEnglishSize.MaterialInventoryGenerationAndfillGapTips ? ChineseEnglishSize.MaterialInventoryGenerationAndfillGapTips.descripts : '以冻结数填充空白'}</Button>
                                        <Button disabled={!this.state.transformData} style={{ color: '#666', cursor: 'pointer', height: '30px', lineHeight: '24px', width: '145px', marginLeft: '10px' }} onClick={() => {
                                            if (this.state.transformData && this.state.state == 10) { this.transformData(2) }
                                        }
                                        }>{ChineseEnglishSize.DrugInventoryFormGenerationAndfillGapTips1 ? ChineseEnglishSize.DrugInventoryFormGenerationAndfillGapTips.descripts : '以0填充空白'}</Button>
                                    </div>
                                    <div className="centerSelectRight" style={{ marginRight: "12px" }}>
                                        <span>{ChineseEnglishSize.MaterialInventoryGenerationAndinventoryGroup ? (ChineseEnglishSize.MaterialInventoryGenerationAndinventoryGroup.descripts + "：") : '盘点组：'}</span>
                                        <Select allowClear={true} style={{ width: '200px' }} value={stkTakeGroupID} onChange={this.getStkTakeGroup}>
                                            {takeGroup}
                                        </Select>
                                    </div>
                                    <div>
                                        <span>{ChineseEnglishSize.MaterialInventoryGenerationAndnameSearch ? (ChineseEnglishSize.MaterialInventoryGenerationAndnameSearch.descripts + "：") : '名称搜索：'}</span>
                                        <Input style={{ width: "400px" }} onPressEnter={this.getStkInputDesc} value={stkInputDesc} onChange={this.getInputDesc} />
                                    </div>

                                </Row>
                                <div>
                                    <Table
                                        columns={modalColumns.length > 0 ? modalColumns : this.modalColumns}
                                        dataSource={this.state.detailsListData}
                                        pagination={false}
                                        bordered
                                        scroll={{ x: modalColumnTotal ? modalColumnTotal : 1350, y: store.getState().tableHeight.y - 46 }}
                                        rowKey={record => record.key}
                                        className='detailsHeight'
                                    />
                                    <CommonPagination size='large' current={this.state.page2} total={this.state.detailTotal} search='search'
                                        onShowSizeChange={this.onShowSizeChange2.bind(this)} complete={true} dataSource={this.state.detailsListData}
                                        loading={this.state.detailsLoading} onChange={this.onChange2.bind(this)} />
                                </div>
                            </Card>
                        </Col>
                    </Row>
                    <AddPayment onRef={this.onRef} handleThis={this} SelectData={this.state.SelectData} ChineseEnglishSize={this.state.ChineseEnglishSize} />
                    <ColumnAuthoritysModel
                        clientWidth='800px'
                        compontName={this.state.takeStockListCode}
                        configType="C"
                        onRef={this.onColumnRef}
                        reloadData={() => {
                            if (this.state.takeStockListCode == 'MaterialInventoryGenerationAnd') {
                                this.getTableColumns()
                            } else if (this.state.takeStockListCode == 'MaterialInventoryEnterDetails') {
                                this.getDetailTableColumns()
                            }
                        }
                        }
                    />
                </div>
            )
        }
    }
);

export default TakeStockCreateBill;